<template>
  <header class="header">
    <h1>todos</h1>
    <input id="toggle-all" class="toggle-all" type="checkbox"  v-model="all" >
    <label for="toggle-all"></label>
    <input
    @keydown.enter="inpFn"
      class="new-todo"
      v-model.trim="iptmsg"
      placeholder="输入任务名称-回车确认"
      autofocus
    />
  </header>
</template>

<script>
import {mapMutations,mapGetters} from 'vuex'
export default {
data() {
  return {
    iptmsg:''
  }
},
methods:{
  ...mapMutations(['setToDoList','setAll']),
  inpFn(){
    // console.log(this.iptmsg)
    if(this.iptmsg.length===0){
          this.iptmsg=''
       return alert('不能输入为空')
      }
    this.setToDoList({name:this.iptmsg,isDo:false})
    this.iptmsg=''
  },

},
computed:{
  ...mapGetters(['allList']),
  all:{
set(val){
   this.setAll(val)
},
get(){
  return this.allList
}
  }
},
watch:{

}

}
</script>
